<template>
  <dataDisplay
    :data-list="dataList"
    class="data-container"
  />
  <!-- <div v-if="curDept && curDept.id" class="data-item">
      <img :src="prevIcon" alt="icon">
      <span class="label">上级总目标(元)：</span>
      <span class="num">{{ targetData.prevTargeData | numberFilter }}</span>
    </div>
    <div class="data-item">
      <img :src="curIcon" alt="icon">
      <span class="label">本级总目标(元)：</span>
      <span class="num">{{ targetData.curTargeData | numberFilter }}</span>
    </div>
    <div class="data-item">
      <img :src="curIcon" alt="icon">
      <span class="label">本级录入目标(元)：</span>
      <span class="num red">{{ targetData.curInputData | numberFilter }}</span>
    </div> -->
</template>

<script>
import { moneyFilter } from '@/filters/number';
import prevIcon from '@/assets/dataDisplay/icon_28.png';
import curIcon from '@/assets/target/curData.png';
import totalIcon from '@/assets/target/totalData.png';
import dataDisplay from '@/components/Common/baseComponent/dataDisplay';
export default {
  components: { dataDisplay },
  filters: {
    moneyFilter

  },
  props: {
    curDept: {
      type: Object,
      default: () => {
        return {};
      }
    },
    targetData: {
      type: Object,
      default: () => {
        return {};
      }
    }
  },
  data() {
    return {
      prevIcon, curIcon
    };
  },
  computed: {
    dataList() {
      const list = [
        { data: this.numberFilter(this.targetData.curTargeData), label: '本级总目标(元)', icon: curIcon },
        { data: this.numberFilter(this.targetData.curInputData), label: '本级录入目标(元)', icon: totalIcon, extendClass: 'red-item' }
      ];
      if (this.curDept && this.curDept.id) {
        list.unshift({ data: this.numberFilter(this.targetData.prevTargeData), label: '上级总目标(元)', icon: prevIcon });
      }
      return list;
    }
  },
  methods: {
    numberFilter(num) {
      const ans = moneyFilter(num);
      return ans && ans !== '0' && ans !== '--' ? ans + '万' : ans;
    }
  }
};
</script>

<style lang="scss" scoped>
.data-container {
  margin-bottom: 10px;
  &::v-deep {
    .red-item {
      .num {
        color: #ff4e5f;
      }
    }
  }
}
</style>
